Skip to content

RHIDP-12601: Scorecard supports custom key values and colors#2214

Open
rh-tokeefe wants to merge 7 commits into
redhat-developer:mainfrom
rh-tokeefe:RHIDP-12601
Open

RHIDP-12601: Scorecard supports custom key values and colors#2214
rh-tokeefe wants to merge 7 commits into
redhat-developer:mainfrom
rh-tokeefe:RHIDP-12601

Conversation

@rh-tokeefe
Copy link
Copy Markdown
Member

@rh-tokeefe rh-tokeefe commented May 18, 2026

@rhdh-bot
Copy link
Copy Markdown
Collaborator

rhdh-bot commented May 18, 2026

PR Build Results

Build passed -- 34/34 titles | 74s
Preview: https://redhat-developer.github.io/red-hat-developers-documentation-rhdh/pr-2214/


Content Quality Assessment

CQA Report

  • CQA-00a: Orphaned modules
  • CQA-00b: Directory structure
  • CQA-01: Vale AsciiDoc DITA compliance
  • CQA-02: Verify assembly structure
  • CQA-03: Verify content type metadata
  • CQA-04: Verify module templates
  • CQA-05: Verify required modular elements
  • CQA-06: Verify assemblies follow official template (one user story)
  • CQA-07: Verify TOC depth (max 3 levels)
  • CQA-08: Verify short description content quality
  • CQA-09: Verify short description format
  • CQA-10: Verify titles are brief, complete, and descriptive
  • CQA-11: Verify procedure prerequisites
  • CQA-12: Verify grammar and style (Vale)
  • CQA-13: Verify content matches declared type
  • CQA-14: Verify no broken links
  • CQA-15: Check redirects
  • CQA-16: Verify official product names
  • CQA-17: Verify legal disclaimers for preview features

Summary

Checks: 19 total, 19 pass, 0 fail

19 checks: 19 pass, 0 fail

Run node build/scripts/cqa/index.js --all --fix locally to review and auto-fix issues.


Updated 2026-05-20 16:03:25 UTC


[NOTE]
====
You must explicitly configure a corresponding icon component layout key for each custom severity color level you declare. Custom severity metrics will not render properly in the dashboard overview if the icon parameter is missing or invalid.
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Each custom severity threshold key requires both a corresponding icon and color. Without them, plugin will not function as YAML configuration is validated on startup.


.Prerequisites
* You have administrative access to the {product} configuration files.
* An existing default Scorecard plugin configuration is deployed.
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  1. You have {configuring-book-link}[added a custom {product-short} application configuration].
  2. An existing default Scorecard plugin configuration is deployed with at least one Scorecard plugin module, see https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html-single/evaluate_project_health_using_scorecards/index#install-and-configure-scorecards-to-view-metrics_evaluate-project-health-using-scorecards.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We're not allowed to have links in the prerequisites section. I added an additional resources section at the end of the procedure. As we move to DITA we will have more rigid structural requirements and restrictions.

* An existing default Scorecard plugin configuration is deployed.

.Procedure
1. Open your {product} YAML configuration file.
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we use app-config.yaml to be consistent with naming of this configuration file in the rest of the Scorecard docs?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


2. Navigate to the `scorecard` backend plugin configuration section.

3. Define your custom severity threshold keys by adding hex color parameters to the `colors` mapping object and valid UI icon names to the `icons` mapping object.
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would be good to mention somewhere what are the options for color configuration:

Color configuration - supports multiple formats:

  • theme palette reference (success.main / warning.main / error.main)
  • HEX code (e.g. '#FFA500')
  • RGB/RGBA (e.g. 'rgb(255, 0, 0)')
    Threshold rules 'success', 'warning' and 'error' have default colors ('success.main', 'warning.main', 'error.main'.

The bullet point with: "- theme palette reference (success.main / warning.main / error.main)" means that administrators can configure custom severity threshold key also with default colors, e.g.:

            - key: error
              expression: '>50'
              color: error.main
              icon: scorecardErrorStatusIcon

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I created a reference topic to capture this information.

expression: '>50'
color: 'rgb(255, 0, 0)'
icon: error
- key: critical
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would be good to use as examples icons that work in rhdh by default (check and error are not ingested in rhdh, so they won't appear):

scorecard:
  plugins:
    myDatasource:
      myMetric:
        thresholds:
          rules:
            - key: ideal
              expression: "<10"
              color: "#5CE65C"
              icon: star
            - key: warning
              expression: 10-50
              color: "rgb(233, 213, 2)"
              icon: monitor
            - key: critical
              expression: ">50"
              color: error.main
              icon: scorecardErrorStatusIcon

I have updated icons to the ones that will work. I have updated colors to be clearly different from the default ones (default dark green is now light green, default orange is now yellow). I have updated keys to be the custom ones instead of default success, warning, error. The critical key shows default color and icon example.

It would be also great if you could mention information about what icons are accepted:
Icon configuration - supports multiple formats:

  • Backstage system icons: 'kind:component', 'kind:api', etc.
  • Material Design icons: 'settings', 'home', 'build', etc. = NOTE that from these, only the ones that are ingested in RHDH actually work - e.g check doesn't work
  • SVG strings: '...'
  • URLs: 'https://example.com/icon.png', '/assets/icon.svg'
  • Data URIs: 'data:image/svg+xml;base64,...'

Threshold rules 'success', 'warning' and 'error' have default icons: scorecardSuccess, scorecardWarningStatusIcon, scorecardErrorStatusIcon

I don't know if there is already page about icons in RHDH, since the same logic for providing icons is also for header I think.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I updated the YAML example and added some information in the reference topic.

@sonarqubecloud
Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Technical review needed 🔩 Test all the procedures

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants